<template>
	<!-- 车辆添加 -->
	<div>
		<div class="edit-top">
			出库信息
			<i class="el-icon-close" @click='cancel'></i>
		</div>
		<div class="edit-content">
			<div class="edit-title">车辆信息</div>
			<div class="edit-item">
				<label>车主(产权人)</label>
				<el-select v-model="client" filterable placeholder="请选择">
					<el-option v-for="(item,index) in client_list" :key="item.id" :label="item.chineseName" :value="index">
					</el-option>
				</el-select>
			</div>
			<div class="edit-item">
				<label>证件类型</label>
				<el-radio v-for='item in client_dict.identityType' disabled :key='item.value' v-model="info.ownerType" :label="item.value">{{item.type}}</el-radio>
			</div>
			<div class="edit-item">
				<label>证件号</label><input readonly="readonly" v-model="info.ownerIdcard" type="text" />
			</div>
			<div class="edit-item">
				<label>车主手机号</label><input readonly="readonly" v-model="info.ownerPhoneNum" type="text" />
			</div>
			<div class="edit-item">
				<label>合同书编号</label>
				<el-select v-model="ordId" filterable remote reserve-keyword placeholder="请输入关键词" :remote-method="remoteMethod">
					<el-option v-for="item in ord_list" :key="item.id" :label="item.contractCode" :value="item.id">
					</el-option>
				</el-select>
			</div>
			<div class="edit-item">
				<label>车架号</label><input v-model="vin" readonly="readonly" type="text" />
			</div>
		</div>
		<div class="edit-bottom">
			<span @click='cancel'>取消</span>
			<el-button @click='save' type="primary">保存</el-button>
		</div>
	</div>
</template>

<script>
	let _this;
	export default {
		props: ['id','vin'],
		data() {
			return {
				value: '',
				client_list: '',
				client: '',
				client_dict: '',
				dict: '',
				ordId:'',
				ord_list: [],
				info: {
					ownerId: '',
					ownerIdcard: '',
					ownerType: '',
					ownerPhoneNum: '',
				}

			}
		},
		created() {
			_this = this;
		},
		watch: {
			client() {
				console.log(_this.client_list[_this.client]);
				_this.info.ownerId = _this.client_list[_this.client].id;
				_this.info.ownerType = _this.client_list[_this.client].identityType + "";
				_this.info.ownerIdcard = _this.client_list[_this.client].identityNum;
				_this.info.ownerPhoneNum = _this.client_list[_this.client].mobileNum;
			}
		},
		mounted() {
			this.get_dict();
			this.get_client_dict();
			this.get_client();
		},
		methods: {
			remoteMethod() {
				this.$axios.post(this.$global.serverIp + 'crm/crmpurchasecontract/findAllOrPage', {
						"limit": "10",
						"page": "1",
						"paginationFlag": true,
					})
					.then(function(res) {
						if (res != '') {
							_this.ord_list = res.data.list;
						}

					})

			},
			get_client() {
				this.$axios.post(this.$global.serverIp + 'admin/sysClient/findPage', {
						"limit": "10000",
						"page": "1"
					})
					.then(function(res) {
						if (res != '') {
							_this.client_list = res.data.list;
						}
					})
			},
			get_client_dict() {
				this.$axios.get(this.$global.serverIp + 'admin/dict/findDict?keyword=sysClient')
					.then(function(res) {
						if (res != '')
							_this.client_dict = res.data;
					})
			},
			get_dict() {
				this.$axios.get(this.$global.serverIp + 'admin/dict/findDict?keyword=vehicle')
					.then(function(res) {
						if (res != '')
							_this.dict = res.data;
					})
			},
			save() {
				if (this.info.ownerId == "") {
					this.$popup.open('车主信息不能为空');
					return;
				}
				if (this.ordId == "") {
					this.$popup.open('合同编号不能为空');
					return;
				}
				var s = {
					"id":this.id,
					"ownerId":this.info.ownerId,
					"purchaseId":this.ordId,
				}

				this.$axios.post(this.$global.serverIp + 'vehicle/vehicle/carCheckout', s)
					.then(function(res) {
						if (res != '') {
							_this.success('出库成功');
						}
					})

			},
			success(content) {
				this.$alert(content, '提示', {
					confirmButtonText: '确定',
					callback: action => {
						_this.$emit("saveCheckout", 2);
					}
				});
			},
			cancel() {
				this.$emit("saveCheckout", 1);
			}
		}
	}
	import '@/assets/css/edit.css'
</script>
